!!! 5
%html
  %head
    %meta{:charset=>"UTF-8"}/
    %title
      排版示例
    :css
      /* 排版演示 */
      div {border: dotted 1px purple;
        weight: 50px;
        text-align: center;}
      #left, #middle, #right {
            float: left;
            width: 33%
        }
      #header, #footer {background-color: goldenrod;}
      /* 清楚浮动演示 */
      #left {height: 100px;
        background-color: cyan;}
      #footer {clear: left;}

  %body
    %h1 浮动显示测试
    这是一段文本
    #header 大头大头下雨不愁人家有伞我有大头
    这又是一段文本
    #left 左青龙
    #middle 老牛在当中
    #right 右白虎
    #footer 神龙摆尾